<template name="home_prifiles">
  <div class="col">
    <div class="edit-profile-content p-3">
      {{> home_content_title_back title="编辑个人信息"}}
      <div class="row py-3">
        <div class="col-lg-8 mx-auto">

          <div class="form-group row">
            <label class="col-sm-2 col-form-label">姓名</label>
            {{#unless isEditingName}}
              <div class="col-sm-10 d-flex align-items-center">
                {{#if currentUserProfile 'name'}}
                  <span class="edit-title">
                    {{currentUserProfile 'name'}}
                    <a class="edit-title-link text-secondary ml-3" id="editName">编辑</a>
                  </span>
                {{else}}
                  <a class="text-secondary" id="editName">编辑</a>
                {{/if}}
              </div>
            {{else}}
              <div class="col-sm-10">
                <input type="text" class="form-control mb-3" id="profileName" placeholder="你的名字" value="{{currentUserProfile 'name'}}">
                <button type="button" class="btn btn-primary" id="updateName">保存</button>
                <button type="button" class="btn btn-secondary" id="cancelEditName">取消</button>
              </div>
            {{/unless}}
          </div><hr />

          <div class="form-group row">
            <label class="col-sm-2 col-form-label">性别</label>
            {{#unless isEditingSex}}
              <div class="col-sm-10 d-flex align-items-center">
                {{#if currentUserProfile 'sex'}}
                  <span class="edit-title">
                    {{currentUserProfile 'sex'}}
                    <a class="edit-title-link text-secondary ml-3" id="editSex">编辑</a>
                  </span>
                {{else}}
                  <a class="text-secondary" id="editSex">编辑</a>
                {{/if}}
              </div>
            {{else}}
              <div class="col-sm-10">
                {{> prifile_sex_radio sex=(currentUserProfile 'sex')}}
                <button type="button" class="btn btn-primary" id="updateSex">保存</button>
                <button type="button" class="btn btn-secondary" id="cancelEditSex">取消</button>
              </div>
            {{/unless}}
          </div><hr />

          <div class="form-group row">
            <label class="col-sm-2 col-form-label">出生日期</label>
            {{#unless isEditingBirth}}
              <div class="col-sm-10 d-flex align-items-center">
                {{#if currentUserProfile 'birth'}}
                  <span class="edit-title">
                    {{currentUserProfile 'birth'}}
                    <a class="edit-title-link text-secondary ml-3" id="editBirth">编辑</a>
                  </span>
                {{else}}
                  <a class="text-secondary" id="editBirth">编辑</a>
                {{/if}}
              </div>
            {{else}}
              <div class="col-sm-10">
                {{> prifile_birth_datepicker birth=(currentUserProfile 'birth')}}
                <button type="button" class="btn btn-primary" id="updateBirth">保存</button>
                <button type="button" class="btn btn-secondary" id="cancelEditBirth">取消</button>
              </div>
            {{/unless}}
          </div><hr />

          <div class="form-group row">
            <label class="col-sm-2 col-form-label">个性签名</label>
            {{#unless isEditingNotes}}
              <div class="col-sm-10 d-flex align-items-center">
                {{#if currentUserProfile 'notes'}}
                  <span class="edit-title">
                    {{currentUserProfile 'notes'}}
                    <a class="edit-title-link text-secondary ml-3" id="editNotes">编辑</a>
                  </span>
                {{else}}
                  <a class="text-secondary" id="editNotes">编辑</a>
                {{/if}}
              </div>
            {{else}}
              <div class="col-sm-10">
                <input type="text" class="form-control mb-3" id="profileNotes" placeholder="一句话介绍自己" value="{{currentUserProfile 'notes'}}">
                <button type="button" class="btn btn-primary" id="updateNotes">保存</button>
                <button type="button" class="btn btn-secondary" id="cancelEditNotes">取消</button>
              </div>
            {{/unless}}
          </div><hr />

        </div>
      </div>
    </div>
  </div>
</template>

<template name="prifile_sex_radio">
  <div class="d-flex align-items-center mb-3" style="height:38px;">
    <div class="custom-control custom-radio custom-control-inline">
      <input type="radio" id="maleRadio" name="sexRadio" class="custom-control-input" value="男">
      <label class="custom-control-label" for="maleRadio">男</label>
    </div>
    <div class="custom-control custom-radio custom-control-inline">
      <input type="radio" id="femaleRadio" name="sexRadio" class="custom-control-input" value="女">
      <label class="custom-control-label" for="femaleRadio">女</label>
    </div>
  </div>
</template>

<template name="prifile_birth_datepicker">
  <input 
    type="text" 
    class="form-control mb-3" 
    id="profileBirth" 
    placeholder="出生日期" 
    data-date-end-date="0d"
    value="{{currentUserProfile 'birth'}}"
  >
</template>
